<template>
	<view>
		<!-- #ifdef MP-->
			<view>用户姓名：{{ userInfo.nickName }}</view>
			<view>
				用户头像：
				<image style="width: 120rpx;height: 120rpx;" :src="userInfo.avatarUrl" mode=""></image>
			</view>
			<button type="default" size="mini" @click="getUserInfo">获取用户信息</button>
		<!-- #endif -->
		
		<!-- #ifndef MP  -->
			除了小程序，其他端不执行相关操作
		<!-- #endif -->
	</view>
</template>

<script>
export default {
	data() {
		return {
			userInfo: {
				nickName: '',
				avatarUrl: ''
			}
		};
	},
	onLoad() {
		// #ifdef MP
			this.login(); // 加载登录凭证
		// #endif
		
	},
	methods: {
		login() {
			// 获取登录用户code

			let _this = this;
			uni.login({
				provider: 'weixin',
				success(res) {
					_this.wxcode = res.code;
				},
				fail(res) {
					console.log(res.errCode);
					console.log(res.errMsg);
				}
			});
		},
		getUserInfo() {
			var _this = this;
			uni.getUserProfile({
				desc: '登录获取个人信息',
				success: response => {
					console.log('response', response);
					_this.userInfo = response.userInfo;
					try {
						uni.showLoading({
							title: '登录中...'
						});
						//请求后台，成功并隐藏加载
						uni.hideLoading({});
					} catch (e) {
						uni.showToast({
							title: '微信登录失败',
							icon: 'none'
						});
					}
				},
				fail: res => {
					uni.showToast({
						title: '您已取消授权',
						icon: 'none'
					});
				}
			});
		}
	}
};
</script>

<style lang="scss">
.itembox {
	border: 2px solid orange;
}
</style>
